<template>
  <div class="goods-box" @click="carsClick(item)">
      <!-- 图片 -->
      <div class="goods-img">
          <img :src="item.mainPic" alt="">
      </div>
      <!-- 标题 -->
      <div class="goods-title">
          {{item.title}}
      </div>
      <div>
          <span class="gang"></span>
      </div>
      <!-- 价钱 -->
      <p>${{item.originalPrice}}<br>or x{{item.actualPrice}}</p>
  </div>
</template>

<script>
export default {
    props:{
        item:{
            type:Object
        }
    },
    methods:{
        carsClick(item){
            this.$emit('carClick',item)
        }
    }

}
</script>

<style scoped>
.goods-box{
    width: 47%;
}
.goods-img{
    width: 100%;
    height: 200px;
}
.goods-img img{
    width: 100%;
}
.goods-title{
    width: 100%;
}
.gang{
    width: 30px;
    height: 2px;
    display: inline-block;
    background: #E8BB00;
}
</style>